<template>
	<view class="custom-icon" :class="['custom-icon-' + type]" :style="{ color: color, 'font-size': size + 'px' }" @click="_onClick" />
</template>

<script>
export default {
	name: 'CustomIcons',
	props: {
		type: {
			type: String,
			default: ''
		},
		color: {
			type: String,
			default: '#333333'
		},
		size: {
			type: [Number, String],
			default: 16
		}
	},
	methods: {
		_onClick() {
			this.$emit('click');
		}
	}
};
</script>

<style>
@font-face {
	font-family: customicon;
	font-weight: normal;
	font-style: normal;
	src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAN4AAsAAAAAB2AAAAMqAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqCSIIyATYCJAMMCwgABCAFhG0HNRt3BsiuMG6xiRZwYRnTomh5BcDB8HHx8DX2v3N39+0XE9STShNNKo2QIJklUhaNeGOY7iX8ef3LUwGnnAR9FDokd85vLtXb6xHEpK03Fnv9dq/d6gFXoozSJUQMCThl7gF3KcO5sSltaU2YiP3u4Jr6NfG8tc0lqjXbIwEnONDIJNuABsQbxq68iM0EWk2KJt5VWs2IbBVGr0Bc16rlItuUWanJDc1CLZlYxGPQnO6kT3jkfz/+WxvNJI3MGHjgYolKlP+r6w/ZHHERkvGcYNPIWE6kECdL3SdIw/ByUq2KWlafWhUhjeWbO75Y1daV/vESURnZ7WAxjCR+ddk8gl8fpkgggxpGLxO5g/T9fQfEJOZdm/Bi2elpT4bFwalxb45xWGZ8eG5mdmF+Nnz80pdhtvaWlr1YZu74yuHeIp6dpqu9OPXn+NnVlYMojlu4tj/HTO3sLPRwLSzuctfuxPaQru35OX7A3NaW93/rAlm+T9XXFM8uhj3W3Ky7A80AsO6hdVqQdxTX1Nc8pNWyAHunPqvePPFv/Phx+5sEXaTY7Pd1b35+ZI75o/bbbFAEJQ/6vd2/Q/ev3pxM9fLvtW0JuUMB4N19R0tR3LlljDutqvK1BJ4gCpzHodLRwg7gZmwop2dLVEbXfCsH5EuSj3/kN267I6fLZdOa2wr4ufH2lG8u2mubz9cTvH9Jy5qiygxLLrLYFuvebHdPZwIKucZbz4de7/21A62zCc0GYkiaTEDWbD5aSMuhoc16qJpthVbLlE1v04eQitKCpYYAhG6nkHR6A1m3B7SQ3qBh0DdU3ZGh1bHoW7DNwrhiv5NAOYUqoBgEWiU2IctG7YPcRqjuNchJUuaTOUjMWh9IWLk6GyuDJkjGGGLuUydSigAi2AhKwXbQYMBAIFgHlTRWQ6mQGbfqYtmbYpXYKLK3EwHJUZAKoDAI0FLCTJDbnLLPfb4RpNbLQI7UFFT4ORBhpm0dSBArvgVapja1KriWa8z6qCWiKARACMwIKAVOyGCGMUAob6cDKVGxND2CgkxxqBFqq46dX2t8gCJWgjEsR4ocRblB5UR22DGJRAAA') format('woff2');
}
.custom-icon {
	font-family: 'customicon' !important;
	font-size: 24px;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	display: inline-block;
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
}
.custom-icon.uni-active {
	color: #007aff;
}
.custom-icon-star-filled:before {
	content: "\e6c3";
}
.custom-icon-star:before {
	content: "\e60f";
}
</style>
